﻿<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="ShoppingCart.aspx.cs" Inherits="UI.gallery" %>

<!DOCTYPE html>
<html lang="en">
	<head>
		<meta charset="utf-8">
		<meta http-equiv="X-UA-Compatible" content="IE=edge">
		<meta name="viewport" content="width=device-width, initial-scale=1.0">
		<link rel="stylesheet" type="text/css" href="css/lrtk.css" />
		<link rel="icon" href="images/icons/logologo.png" />
		<title>vacayhome</title>
		<link rel="stylesheet" href="css/carts.css">
		<link rel="stylesheet" href="reset.css">
		<script src="js/carts.js" type="text/javascript"></script>
		<!-- Bootstrap core CSS -->
		<link href="css/bootstrap.min.css" rel="stylesheet">
		<link href="font-awesome/css/font-awesome.min.css" rel="stylesheet" type="text/css" />
		<!-- Custom styles for this template -->
		<link href="css/style.css" rel="stylesheet">
		<link href="fonts/antonio-exotic/stylesheet.css" rel="stylesheet">
		<link rel="stylesheet" href="css/lightbox.min.css">
		<link href="css/responsive.css" rel="stylesheet">
		<script src="js/jquery.min.js" type="text/javascript"></script>
		<script src="js/bootstrap.min.js" type="text/javascript"></script>
		<script src="js/jquery.imagesloaded.js"></script>
		<script src="js/masonry.pkgd.min.js"></script>
		<script src="js/lightbox-plus-jquery.min.js" type="text/javascript"></script>
		<script src="js/instafeed.min.js" type="text/javascript"></script>
		<script src="js/custom.js" type="text/javascript"></script>
		<style>
			.grid {
                background: rgba(0,0,0,0);
            }
            /* clear fix */
            .grid:after {
                content: '';
                display: block;
                clear: both;
            }
            /* ---- .grid-item ---- */
            .grid-sizer,
            .grid-item {
                width: 33.34%;
            }
            .grid-item {
                float: left;
            }
            .grid-item img {
                display: block;
                max-width: 100%;
            }
        </style>
	</head>
	<body>
		<div id="page">
			<!---header top---->
			<div class="top-header">
                <div class="container">
                    <div class="row">
                        <div class="col-md-6">
                            <!--                            <a href="#"> </a>
                                                        <div class="info-block"><i class="fa fa-map"></i>701 Old York Drive Richmond USA.</div>-->
                        </div>
                        <div class="col-md-6">
                            <div class="social-grid">
                                <ul class="list-unstyled text-right">
                                	<li><a href="Login.aspx">登录</a>&nbsp;&nbsp;-&nbsp;&nbsp;<a href="registered.aspx">注册</a></li>
                                    
                                    
                                </ul>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <!--header--->
            <header class="header-container">
                <div class="container">
                    <div class="top-row">
                        <div class="row">
                            <div class="col-md-2 col-sm-6 col-xs-6">
                                <div id="logo">
                                    <!--<a href="index.html"><img src="images/logo.png" alt="logo"></a>-->
                                    <a href="index.aspx"><img src="images/logologo.png" width="130" height="130"/></a>
                                </div>                       
                            </div>
                            <div class="col-sm-6 visible-sm">
                                <div class="text-right"><button type="button" class="book-now-btn">Book Now</button></div>
                            </div>
                            <div class="col-md-8 col-sm-12 col-xs-12 remove-padd">
                                <nav class="navbar navbar-default">
                                    <div class="navbar-header page-scroll">
                                        <button data-target=".navbar-ex1-collapse" data-toggle="collapse" class="navbar-toggle" type="button">
                                            <span class="sr-only">Toggle navigation</span>
                                            <span class="icon-bar"></span>
                                            <span class="icon-bar"></span>
                                            <span class="icon-bar"></span>
                                        </button>

                                    </div>
                                    <div class="collapse navigation navbar-collapse navbar-ex1-collapse remove-space">
                                        <ul class="list-unstyled nav1 cl-effect-10">
                                            <li><a  data-hover="首页"href="index.aspx"><span>首页</span></a></li>
                                            <li><a data-hover="所有商品"  href="abount.aspx"><span>所有商品</span></a></li>
                                            <li><a data-hover="幸运揭晓"  href="Luck.aspx"><span>幸运揭晓</span></a></li>
                                            <li><a data-hover="新手指南" href="NewbieGuide.aspx"><span>新手指南</span></a></li>
                                            <li><a data-hover="购物车" class="active"><span>购物车</span></a></li>
                                            
                                            <li><a data-hover="联系我们" href="contact.aspx"><span>联系我们</span></a></li>
                                        </ul>

                                    </div>
                                </nav>
                            </div>
                            <div class="col-md-2  col-sm-4 col-xs-12 hidden-sm">
                                <div class="text-right"><button type="button" class="book-now-btn"><a href="Center.aspx">个人中心</a></button></div>
                            </div>
                        </div>
                    </div>
                </div>
            </header>


			<!--end-->
			<!-- 中间部分 -->

			<!---footer--->
			<section class="cartMain">
				<div class="cartMain_hd">
					<ul class="order_lists cartTop">
						<li class="list_chk">
							<!--所有商品全选-->
							<input type="checkbox" id="all" class="whole_check">
							<label for="all"></label>
							全选
						</li>
						<li class="list_con">商品信息</li>
						<li class="list_info">商品参数</li>
						<li class="list_price">单价</li>
						<li class="list_amount">数量</li>
						<li class="list_sum">金额</li>
						<li class="list_op">操作</li>
					</ul>
				</div>

				<div class="cartBox">
					<div class="shop_info">
						<div class="all_check">
							<!--店铺全选-->
							<input type="checkbox" id="shop_a" class="shopChoice">
							<label for="shop_a" class="shop"></label>
						</div>
						<div class="shop_name">
							店铺：<a href="index.html">一元幸运购</a>
						</div>
					</div>
					<div class="order_content">
						<ul class="order_lists">
							<li class="list_chk">
								<input type="checkbox" id="checkbox_2" class="son_check">
								<label for="checkbox_2"></label>
							</li>
							<li class="list_con">
								<div class="list_img"><a href="javascript:;"><img src="images/1.png" alt=""></a></div>
								<div class="list_text"><a href="javascript:;">夏季男士迷彩无袖T恤圆领潮流韩版修身男装背心青年时尚打底衫男</a></div>
							</li>
							<li class="list_info">
								<p>规格：默认</p>
								<p>尺寸：16*16*3(cm)</p>
							</li>
							<li class="list_price">
								<p class="price">￥1</p>
							</li>
							<li class="list_amount">
								<div class="amount_box">
									<a href="javascript:;" class="reduce reSty">-</a>
									<input type="text" value="1" class="sum">
									<a href="javascript:;" class="plus">+</a>
								</div>
							</li>
							<li class="list_sum">
								<p class="sum_price">￥1</p>
							</li>
							<li class="list_op">
								<p class="del"><a href="javascript:;" class="delBtn">移除商品</a></p>
							</li>
						</ul>
						<ul class="order_lists">
							<li class="list_chk">
								<input type="checkbox" id="checkbox_3" class="son_check">
								<label for="checkbox_3"></label>
							</li>
							<li class="list_con">
								<div class="list_img"><a href="javascript:;"><img src="images/2.png" alt=""></a></div>
								<div class="list_text"><a href="javascript:;">夏季男士迷彩无袖T恤圆领潮流韩版修身男装背心青年时尚打底衫男</a></div>
							</li>
							<li class="list_info">
								<p>规格：默认</p>
								<p>尺寸：16*16*3(cm)</p>
							</li>
							<li class="list_price">
								<p class="price">￥1</p>
							</li>
							<li class="list_amount">
								<div class="amount_box">
									<a href="javascript:;" class="reduce reSty">-</a>
									<input type="text" value="1" class="sum">
									<a href="javascript:;" class="plus">+</a>
								</div>
							</li>
							<li class="list_sum">
								<p class="sum_price">￥1</p>
							</li>
							<li class="list_op">
								<p class="del"><a href="javascript:;" class="delBtn">移除商品</a></p>
							</li>
						</ul>
						<ul class="order_lists">
							<li class="list_chk">
								<input type="checkbox" id="checkbox_6" class="son_check">
								<label for="checkbox_6"></label>
							</li>
							<li class="list_con">
								<div class="list_img"><a href="javascript:;"><img src="images/3.png" alt=""></a></div>
								<div class="list_text"><a href="javascript:;">夏季男士迷彩无袖T恤圆领潮流韩版修身男装背心青年时尚打底衫男</a></div>
							</li>
							<li class="list_info">
								<p>规格：默认</p>
								<p>尺寸：16*16*3(cm)</p>
							</li>
							<li class="list_price">
								<p class="price">￥1</p>
							</li>
							<li class="list_amount">
								<div class="amount_box">
									<a href="javascript:;" class="reduce reSty">-</a>
									<input type="text" value="1" class="sum">
									<a href="javascript:;" class="plus">+</a>
								</div>
							</li>
							<li class="list_sum">
								<p class="sum_price">￥1</p>
							</li>
							<li class="list_op">
								<p class="del"><a href="javascript:;" class="delBtn">移除商品</a></p>
							</li>
						</ul>
						<ul class="order_lists">
							<li class="list_chk">
								<input type="checkbox" id="checkbox_8" class="son_check">
								<label for="checkbox_8"></label>
							</li>
							<li class="list_con">
								<div class="list_img"><a href="javascript:;"><img src="images/1.png" alt=""></a></div>
								<div class="list_text"><a href="javascript:;">夏季男士迷彩无袖T恤圆领潮流韩版修身男装背心青年时尚打底衫男</a></div>
							</li>
							<li class="list_info">
								<p>规格：默认</p>
								<p>尺寸：16*16*3(cm)</p>
							</li>
							<li class="list_price">
								<p class="price">￥1</p>
							</li>
							<li class="list_amount">
								<div class="amount_box">
									<a href="javascript:;" class="reduce reSty">-</a>
									<input type="text" value="1" class="sum">
									<a href="javascript:;" class="plus">+</a>
								</div>
							</li>
							<li class="list_sum">
								<p class="sum_price">￥1</p>
							</li>
							<li class="list_op">
								<p class="del"><a href="javascript:;" class="delBtn">移除商品</a></p>
							</li>
						</ul>
						<ul class="order_lists">
							<li class="list_chk">
								<input type="checkbox" id="checkbox_9" class="son_check">
								<label for="checkbox_9"></label>
							</li>
							<li class="list_con">
								<div class="list_img"><a href="javascript:;"><img src="images/1.png" alt=""></a></div>
								<div class="list_text"><a href="javascript:;">夏季男士迷彩无袖T恤圆领潮流韩版修身男装背心青年时尚打底衫男</a></div>
							</li>
							<li class="list_info">
								<p>规格：默认</p>
								<p>尺寸：16*16*3(cm)</p>
							</li>
							<li class="list_price">
								<p class="price">￥1</p>
							</li>
							<li class="list_amount">
								<div class="amount_box">
									<a href="javascript:;" class="reduce reSty">-</a>
									<input type="text" value="1" class="sum">
									<a href="javascript:;" class="plus">+</a>
								</div>
							</li>
							<li class="list_sum">
								<p class="sum_price">￥1</p>
							</li>
							<li class="list_op">
								<p class="del"><a href="javascript:;" class="delBtn">移除商品</a></p>
							</li>
						</ul>

					</div>
				</div>


				<div class="bar-wrapper">
					<div class="bar-right">
						<div class="piece">已选商品<strong class="piece_num">0</strong>件</div>
						<div class="totalMoney">共计: <strong class="total_text">0.00</strong></div>
						<div class="calBtn"><a href="javascript:;">结算</a></div>
					</div>
				</div>
			</section>
			<section class="model_bg"></section>
			<section class="my_model">
				<p class="title">删除宝贝<span class="closeModel">X</span></p>
				<p>您确认要删除该宝贝吗？</p>
				<div class="opBtn"><a href="javascript:;" class="dialog-sure">确定</a><a href="javascript:;" class="dialog-close">关闭</a></div>
			</section>

			<!--                <div class="container">
                    <div class="rowo">
                        <div class="col-md-3 col-sm-6 col-xs-12 width-set-50">
                            <div class="footer-details">
                                <h4>联系我们</h4>
                                <ul class="list-unstyled footer-contact-list">
                                    <li>
                                        <i class="fa fa-map-marker fa-lg"></i>
                                        <p>湖南省长沙市ZYL一元幸运购有限公司</p>
                                    </li>
                                    <li>
                                        <i class="fa fa-phone fa-lg"></i>
                                        <p><a href="tel:+1-202-555-0100">18888888888</a></p>
                                    </li>
                                    <li>
                                        <i class="fa fa-envelope-o fa-lg"></i>
                                        <p><a href="mailto:demo@info.com"> 1278338940@qq.com</a></p>
                                    </li>
                                </ul>
                                <div class="footer-social-icon">
                                    <a href="#"><i class="fa fa-qq"></i></a>
                                    <a href="#"><i class="fa fa-weixin"></i></a>                           
                                    <a href="#"><i class="fa fa-weibo"></i></a>
                                    <a href="#"><i class="fa fa-twitter"></i></a>
                                    <a href="#"><i class="fa fa-facebook"></i></a>
                                </div>
                                
                            </div>
                        </div>
                        <div class="col-md-3 col-sm-6 col-xs-12 width-50 width-set-50">
                            <div class="footer-details">
                                <h4>目录一览</h4>
                                <ul class="list-unstyled footer-links">
                                    <li class="active"><a>首页</a></li>
                                    <li><a href="about.html">所有商品</a></li>
                                    <li><a href="rooms.html">幸运揭晓</a></li>
                                    <li><a href="gallery.html">新手指南</a></li>
                                    <li><a href="#">购物车</a></li>
                                    <li> <a href="news.html">购物历史</a></li>
                                    <li> <a href="contact.html">联系我们</a></li>
                                </ul>
                            </div>
                        </div>
                        <div class="col-md-6 col-sm-12 col-xs-12">
                        	<div id="dibu">
                        		<div class="footer-details">
                                <h4>一个专注于你的幸运的网站</h4>
                                <div class="row">
                                	<a href="index.html"><img src="images/logobai.png" width="300" height="300"></a>
                                    <div class="instagram-images">
                                        <div id="instafeed"></div>
                                    </div>
                                </div>
                            </div>
                        	</div>
                            
                        </div>
                    </div>

                    <div class="copyright">
                        &copy; 2018 All right reserved. Designed by <a href="#" target="_blank">ThemeVault.</a> -  More Templates <a href="http://www.cssmoban.com/" target="_blank" title="模板之家">ZYL</a> - Collect from <a href="http://www.cssmoban.com/" title="网页模板" target="_blank">一元云购</a>
                    </div>

                </div>
           
 -->
			<!--back to top--->
			<!-- 代码开始 -->
			<div id="leftsead">
				<ul>
					<li>
						<a href="javascript:void(0)" class="youhui">
							<img src="images/l02.png" width="47" height="49" class="shows" />
							<img src="images/a.png" width="57" height="49" class="hides" />
							<img src="images/weixin.jpg" width="145" class="2wm" style="display:none;margin:-100px 57px 0 0" />
						</a>
					</li>
					<li>
						<a href="http://wpa.qq.com/msgrd?v=3&uin=1046863485&site=qq&menu=yes" target="_blank">
							<div class="hides" style="width:161px;display:none;" id="qq">
								<div class="hides" id="p1">
									<img src="images/ll04.png">
								</div>
								<div class="hides" id="p2"><span style="color:#FFF;font-size:13px">1046863485</span>
								</div>
							</div>
							<img src="images/l04.png" width="47" height="49" class="shows" />
						</a>
					</li>
					<li id="tel">
						<a href="javascript:void(0)">
							<div class="hides" style="width:161px;display:none;" id="tels">
								<div class="hides" id="Div1">
									<img src="images/ll05.png">
								</div>
								<div class="hides" id="p3"><span style="color:#FFF;font-size:12px">0551-65371998</span>
								</div>
							</div>
							<img src="images/l05.png" width="47" height="49" class="shows" />
						</a>
					</li>
					<li id="btn">
						<a id="top_btn">
							<div class="hides" style="width:161px;display:none">
								<img src="images/ll06.png" width="161" height="49" />
							</div>
							<img src="images/l06.png" width="47" height="49" class="shows" />
						</a>
					</li>
				</ul>
			</div>

			<script>
			    $(document).ready(function () {

			        $("#leftsead a").hover(function () {
			            if ($(this).prop("className") == "youhui") {
			                $(this).children("img.hides").show();
			            } else {
			                $(this).children("div.hides").show();
			                $(this).children("img.shows").hide();
			                $(this).children("div.hides").animate({
			                    marginRight: '0px'
			                }, '0');
			            }
			        }, function () {
			            if ($(this).prop("className") == "youhui") {
			                $(this).children("img.hides").hide();
			            } else {
			                $(this).children("div.hides").animate({
			                    marginRight: '-163px'
			                }, 0, function () {
			                    $(this).hide();
			                    $(this).next("img.shows").show();
			                });
			            }
			        });

			        $("#top_btn").click(function () {
			            if (scroll == "off") return;
			            $("html,body").animate({
			                scrollTop: 0
			            }, 600);
			        });

			        //右侧导航 - 二维码
			        $(".youhui").mouseover(function () {
			            $(this).children(".2wm").show();
			        })
			        $(".youhui").mouseout(function () {
			            $(this).children(".2wm").hide();
			        });


			    });
			</script>
			<!-- 代码结束 -->

		</div>
		<script>
		    var grid = document.querySelector('.grid');

		    var msnry = new Masonry(grid, {
		        itemSelector: '.grid-item',
		        columnWidth: '.grid-sizer',
		        percentPosition: true
		    });

		    imagesLoaded(grid).on('progress', function () {
		        // layout Masonry after each image loads
		        msnry.layout();
		    });
		</script>

		<!-- 右下角 -->

	</body>
	<script src="js/jquery.min.js"></script>
	<script src="js/carts.js"></script>
	<link rel="stylesheet" href="css/reset.css">
	<link rel="stylesheet" href="css/carts.css">
</html>

